<template>
	<!-- 创新工作室 -->
	<view>
		<!-- <view class="search-wrap">
			<up-search placeholder="请输入关键字" v-model="pageRequest.studioName" :showAction="false" @blur="search"></up-search>
		</view> -->
		
		<view class="filter-list">
			<up-dropdown>
				<up-dropdown-item v-model="pageRequest" title="全部" :options="yearOptions" @change="change"></up-dropdown-item>
				<up-dropdown-item v-model="pageRequest.listingLevel" title="级别" :options="levelOptions" @change="change1"></up-dropdown-item>
				<up-dropdown-item v-model="pageRequest.studioType" title="类型" :options="unitOptions" @change="change2"></up-dropdown-item>
			</up-dropdown>
		</view>
		<view class="center-view">
			<view class="info-list">
				<scroll-view
				     class="scroll-view"
				     scroll-y
				     @scrolltolower="getDataList"
				   >
					<view class="news-item" v-for="(item,index) in innovationList" :key="index" @tap="getDetail(item.id)">
						<up-image :src="item.surfacePlot" width="160rpx" height="160rpx"></up-image>
						
						<view class="news-info">
							<view class="news-title">{{item.studioName}}</view>
							<view class="tag-wrap">
								<u-tag :text="item.listingLevelStr"  size="mini" type="success" style="margin-right: 10rpx;"></u-tag>
								<u-tag :text="item.studioTypeStr"  size="mini" type="warning"></u-tag>
							</view>
							<view class="bottom-info">
								<view class="count">
									<up-icon name="clock" size="20"></up-icon>
									<view>{{item.createTime}}</view>
								</view>
								<view class="org">
									<!-- <up-icon name="star" size="20"></up-icon>
									<view>阅读量</view> -->
								</view>
								
							</view>
						</view>
					</view>
					<view style="margin-top: 200rpx;">
						<up-empty
						mode="data" 
						iconSize="60" 
						text="暂无数据" 
						icon="https://jqgh-public.yqfoodec.com/20250405/%E7%BB%84%2016@2x_53897.png" 
						v-if="innovationList.length == 0"></up-empty>
					</view>
				</scroll-view>
				
			</view>
			
		</view>
<!-- 		<view class="btn-view">
			<up-button color="#FF0000" shape="circle" text="我要申报" @click="declare"></up-button>
		</view> -->
	</view>
</template>

<script>
	import publicityList from '@/components/publicity-list.vue'
	import {innovationStudioApi} from '@/api/innovation/innovation-studio-api.js';
	export default {
		components: {
			publicityList
		},
		data() {
			return {
				level: '',
				unit: '',
				year: '',
				levelOptions: [
					
				],
				unitOptions: [
					
				],
				yearOptions: [
					{
						label: '全部',
						value: -1
					}
					
				],
				innovationList:[],
				pageRequest:{
					page:1,
					limit:10,
					studioName:'',
					listingLevel:-1,
					studioType:-1,
				},
				hasMore:true,
			}
		},
		onLoad() {
			this.getDataList();
			this.getDict();
		},
		methods: {
			getDetail(id) {
				uni.navigateTo({
				    url: '../innovation-studio/detail?id='+id
				});
			},
			async getDataList(){
				if (!this.hasMore) {
					uni.showToast({
					  title: '没有更多数据了',
					  icon: 'none',
					});
					return;
				}
				
				
				const result = await innovationStudioApi.queryList(this.pageRequest);
				if(result.data.list.length > 0){
					this.innovationList.push(...result.data.list);
					this.pageRequest.page++;
				}else {
					if(this.innovationList.length > 0){
						uni.showToast({
						  title: '没有更多数据了',
						  icon: 'none',
						});
					}
					this.hasMore = false;
					
				}
			},
			async search(){
				this.innovationList = [];
				this.hasMore = true;
				this.pageRequest.page = 1;
				await this.getDataList();
			},
			async getDict(){
				const res = await innovationStudioApi.getDictData();
				this.levelOptions = res.data.studioListingLevel;
				this.unitOptions = res.data.studioType;
				this.convert(this.levelOptions);
				this.convert(this.unitOptions);
				
			},
			convert(options){
				for (var i = 0; i < options.length; i++) {
					const item = options[i];
					item.label = item.dictLabel;
					item.value = item.dictValue;
				}
			},
			async change1(e){
				this.pageRequest.listingLevel = e;
				this.hasMore = true;
				this.innovationList = [];
				await this.getDataList()
			},
			async change2(e){
				this.pageRequest.studioType = e;
				this.hasMore = true;
				this.innovationList = [];
				await this.getDataList()
			},
			async change(){
				this.pageRequest = {
					page:1,
					limit:10,
					studioName:'',
					listingLevel:-1,
					studioType:-1,
				}
				this.hasMore = true;
				this.innovationList = [];
				await this.getDataList();
			}
		}
	}
</script>

<style lang="scss" scoped>
	.search-wrap {
		padding: 30rpx;
	}
	.filter-list {
		border-bottom: 1px solid #f5f5f5;
	}
	.center-view {
		padding-bottom: 200rpx;
	}
	.info-list {
		padding: 0 30rpx;
	}
	.scroll-view{
		height: 85vh;
		// border: 1px solid red;
	}
	.tag-wrap{
		display: flex;
	}
	.news-title{
		font-size: 18px;
		font-weight: 700;
	}
</style>